/*
 * 个人信息组件 - Person Info Component
 * 显示管理员个人信息和统计数据
 */
import { UserInfo } from '@/models/user';
import { getAllCategory } from '@/services/Category/api';
import { getPostPage } from '@/services/Post/api';
import { getTagList } from '@/services/Tag/api';
import { getAdminInfo } from '@/services/User/api';
import {
  CalendarOutlined,
  EnvironmentOutlined,
  FileTextOutlined,
  FolderOutlined,
  TagsOutlined,
  UserOutlined,
} from '@ant-design/icons';
import { Avatar, message } from 'antd';
import React, { useEffect, useState } from 'react';
import styles from './index.less';

interface PersonInfoProps {
  className?: string;
}

const PersonInfo: React.FC<PersonInfoProps> = ({ className }) => {
  const [adminInfo, setAdminInfo] = useState<UserInfo>();
  const [statsData, setStatsData] = useState({
    postCount: 0,
    categoryCount: 0,
    tagCount: 0,
  });

  useEffect(() => {
    const fetchAdminInfo = async () => {
      try {
        const adminResponse = await getAdminInfo();

        // 使用优化后的API响应处理
        if (adminResponse.success && adminResponse.data) {
          setAdminInfo(adminResponse.data);
        } else {
          message.error('获取管理员信息失败');
        }
      } catch (error) {
        console.error('获取管理员信息错误:', error);
        message.error('获取管理员信息失败，请稍后重试');
      }
    };

    const fetchTagList = async () => {
      try {
        const tagsResponse = await getTagList();

        // 使用优化后的API响应处理
        if (tagsResponse.success && tagsResponse.data) {
          // 更新标签统计数据
          setStatsData((prev) => ({
            ...prev,
            tagCount: tagsResponse.data?.length || 0,
          }));
        } else {
          message.error('获取标签列表失败');
        }
      } catch (error) {
        console.error('获取标签列表错误:', error);
        message.error('获取标签列表失败，请稍后重试');
      }
    };

    const fetchCategoryList = async () => {
      try {
        const categoriesResponse = await getAllCategory();

        // 使用优化后的API响应处理
        if (categoriesResponse.success && categoriesResponse.data) {
          // 更新分类统计数据
          setStatsData((prev) => ({
            ...prev,
            categoryCount: categoriesResponse.data?.length || 0,
          }));
        } else {
          message.error('获取分类列表失败');
        }
      } catch (error) {
        console.error('获取分类列表错误:', error);
        message.error('获取分类列表失败，请稍后重试');
      }
    };

    const fetchPostStats = async () => {
      try {
        // 获取第一页数据来获取总数
        const postsResponse = await getPostPage(1, 1);

        // 使用优化后的API响应处理
        if (postsResponse.success && postsResponse.data) {
          // 更新文章统计数据
          setStatsData((prev) => ({
            ...prev,
            postCount: postsResponse.data?.total || 0,
          }));
        } else {
          message.error('获取文章统计失败');
        }
      } catch (error) {
        console.error('获取文章统计错误:', error);
        message.error('获取文章统计失败，请稍后重试');
      }
    };

    fetchAdminInfo();
    fetchTagList();
    fetchCategoryList();
    fetchPostStats();
  }, []);

  return (
    <div className={`${styles.profile} ${className || ''}`}>
      <Avatar size={120} src={adminInfo?.avatar} icon={<UserOutlined />} />
      <div className={styles.info}>
        <h3>{adminInfo?.username}</h3>
        <p>
          <EnvironmentOutlined /> {adminInfo?.ip}
        </p>
        <p>
          <CalendarOutlined /> {adminInfo?.createTime}
        </p>

        {/* 统计数据展示 */}
        <div className={styles.statsContainer}>
          <div className={styles.statItem}>
            <FileTextOutlined className={styles.statIcon} />
            <span className={styles.statNumber}>{statsData.postCount}</span>
            <span className={styles.statLabel}>文章</span>
          </div>
          <div className={styles.statItem}>
            <FolderOutlined className={styles.statIcon} />
            <span className={styles.statNumber}>{statsData.categoryCount}</span>
            <span className={styles.statLabel}>分类</span>
          </div>
          <div className={styles.statItem}>
            <TagsOutlined className={styles.statIcon} />
            <span className={styles.statNumber}>{statsData.tagCount}</span>
            <span className={styles.statLabel}>标签</span>
          </div>
        </div>
      </div>
    </div>
  );
};

export default PersonInfo;
